//The selection effect
function SelectMask(dom) {
    this._dom = dom;
    this._selectEffectMaskContainer = $('<div/>');
    this._selectionClass = 'calendar-day-select-mask';
}
SelectMask.prototype = {
    show: function(daysToFill) {
        var me = this; 
        this.remove();
        this._selectEffectMaskContainer = $('<div />');
        this._selectEffectMaskContainer.css('z-index', CalendarZIndexManager.selectMaskZIndex);
        var dayGroups = daysToFill.split(function(date) { return date.isMonday() });
        dayGroups.foreach(function(dayGroup) {
            me._addDayGroup(dayGroup);
        });
        this._dom.append(this._selectEffectMaskContainer);

    },
    _addDayGroup: function(dayGroup) {
        var firstDayDom = $('#' + DayView.getDateCellId(dayGroup.first()));
        var lastDayDom = $('#' + DayView.getDateCellId(dayGroup.last()));
        var selectionMask = $('<span>')
                .addClass(this._selectionClass)
                .css('width', lastDayDom.position().left + lastDayDom.width() - firstDayDom.position().left)
                .css('height', firstDayDom.height())
                .css('left', firstDayDom.position().left)
                .css('top', firstDayDom.position().top);
        selectionMask.appendTo(this._selectEffectMaskContainer);
    },

    remove: function() {
        this._selectEffectMaskContainer.remove();
    }
};
